<!DOCTYPE html>
<html>
    <head>
        {include file='public/meta'/}

        <link rel="stylesheet" type="text/css" href="/assets/merchant/css/bootstrap-datetimepicker.css"/>


        <link rel="stylesheet" href="/assets/merchant/css/addmchat.css" />

        <style type="text/css">
            .red{
                color: #FF6667;
            }
            .green{
                color: #66CC99;
            }
            .persont{
                font-size: 12px;
            }
        </style>
    </head>
    <body>
    {include file='public/header'/}
    <section>
        <!------------------导航-------------------------->
        {include file='public/left'/}
        <!--------------------------主要内容区域------------------------------------->
        <div class="content">
            <div class="page-heading">
                <ul class="breadcrumb">
                    <li>
                        当前位置是&nbsp;:&nbsp;卡券管理
                    </li>
                    <li class="active" style="color: #02b87f;"> 原会员导入</li>
                </ul>
            </div>
            <div class="mgl15 mgr15">

                <div class="panel panel-default">
                    <div class="panel-heading" style="position:relative;">
                        <h5 class="panel-title">
                            导入列表
                        </h5>
                        <button class="btn btn-default" data-toggle="modal" data-target=".bs-example-modal-sm"  style="position:absolute;right:10px;top:2px;" >导入原会员</button>
                        <div class="modal fade bs-example-modal-sm" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel">
                            <div class="modal-dialog modal-sm" role="document">
                                <div class="modal-content">
                                    <form action="" method="post" enctype="multipart/form-data">
                                        <label>上传文件：</label>
                                        <input type="file" name="user" class="form-control ipt4" style="margin:15px;"/> 请勿单次上传超过5000条
                                        <input type="submit" class="btn btn-primary" value="确认保存" style="margin:15px;"/>
                                        </table>
                                    </form>

                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="panel-body">
                        <table class="table table-hover" id="tableExcel">
                            <thead>
                                <tr>
                                    <th>姓名</th>
                                    <th>电话</th>
                                    <th>地址</th>
                                    <th>积分</th>
                                    <th>余额</th>
                                </tr>
                            </thead>
                            <tbody>
                            <volist name="list" id="vo">
                                <tr>
                                    <td>{$vo.name}</td>
                                    <td>{$vo.phone}</td>
                                    <td>{$vo.address}</td>
                                    <td>{$vo.bonus}</td>
                                    <td>{$vo.balance}</td>
                                </tr>
                            </volist>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
            {include file='public/footer'/}
        </div>
    </section>
</body>
<script src="/assets/merchant/js/commen.js" type="text/javascript" charset="utf-8"></script>
<script src="/assets/merchant/js/bootstrap-datetimepicker.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
    $(function () {
        var myDate = new Date();
        $('#startime').datetimepicker({
            minView: "month", //选择日期后，不会再跳转去选择时分秒
            language: 'zh-CN',
            format: 'yyyy-mm-dd',
            todayBtn: 1,
            autoclose: 1,
            todayHighlight: true,
            endDate: myDate.toLocaleDateString()
        }).on('changeDate', function (ev) {
            var starttime = $('#startime1').val();
            var endtime = $('#endtime1').val();
            if (starttime != "" && endtime != "") {
                var startD = new Date(Date.parse(starttime.replace(/-/g, "/")));
                var endD = new Date(Date.parse(endtime.replace(/-/g, "/")));
                var days = parseInt((endD.getTime() - startD.getTime()) / (1000 * 60 * 60 * 24));
                if (days > 31) {
                    alert("日期范围应在一个月之内");
                    $('#startime1').val('');
                    return false;
                };
                if (endtime < starttime) {
                    $('#startime1').val('');
                    alert('开始时间必须大于结束时间');
                    return;
                };
                $("#endtime").datetimepicker('setStartDate',starttime);
                $("#starttime").datetimepicker('hide');
            }
        });
        $('#endtime').datetimepicker({
            minView: "month", //选择日期后，不会再跳转去选择时分秒
            language: 'zh-CN',
            format: 'yyyy-mm-dd',
            todayBtn: 1,
            autoclose: 1,
            todayHighlight: true,
            endDate: myDate.toLocaleDateString()
        }).on('changeDate', function (ev) {
            var starttime = $('#startime1').val();
            var endtime = $('#endtime1').val();
            if (starttime != "" && endtime != "") {
                var startD = new Date(Date.parse(starttime.replace(/-/g, "/")));
                var endD = new Date(Date.parse(endtime.replace(/-/g, "/")));
                var days = parseInt((endD.getTime() - startD.getTime()) / (1000 * 60 * 60 * 24));
                if (days > 31) {
                    alert("日期范围应在一个月之内");
                    $('#endtime1').val('');
                    return false;
                };
                if (endtime < starttime) {
                    $('#endtime1').val('');
                    alert('开始时间必须大于结束时间');
                    return;
                };
                $("#starttime").datetimepicker('setEndDate',endtime);
                $("#endttime").datetimepicker('hide');
            }
        });
    });
//筛选
    function filter() {
        var ii = layer.load();
        setTimeout(function () {
            layer.close(ii);
        }, 1000);
        $("#countform").submit();

    }
//清空筛选条件
    $(function () {
        $("#payclear").click(function () {
            $(".form-virtical input").val("");
            $(".form-virtical select").val("");
        })
    })
</script>
<script type="text/javascript">
    $(".persontnum").each(function (i) {
        var val = $(this).text();
        var type = val[0];
        if (type == "-") {
            $(this).next(".glyphicon").addClass("glyphicon-arrow-down");
            $(this).next(".glyphicon").addClass("green");
        } else if (type == "+") {
            $(this).next(".glyphicon").addClass("glyphicon-arrow-up");
            $(this).next(".glyphicon").addClass("red");
        }
    })
</script>
<script type="text/javascript">
/**
* 将html的table转成Excel的data协议类型数据，不支持ie
*   table 是HTML DOM Document 对象
× name 是sheet的名称
*/
var tableToExcel = (function() {
    var uri = 'data:application/vnd.ms-excel;base64,',
            template = '<html xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:x="urn:schemas-microsoft-com:office:excel" xmlns="http://www.w3.org/TR/REC-html40">'
                             + '<head><meta http-equiv="Content-type" content="text/html;charset=UTF-8" /><!--[if gte mso 9]><xml><x:ExcelWorkbook><x:ExcelWorksheets><x:ExcelWorksheet><x:Name>{worksheet}</x:Name><x:WorksheetOptions><x:DisplayGridlines/>'
                             + '</x:WorksheetOptions></x:ExcelWorksheet></x:ExcelWorksheets></x:ExcelWorkbook></xml><![endif]--></head><body><table>{table}</table></body></html>',
            base64 = function(s) {
                return window.btoa(unescape(encodeURIComponent(s)))
            },
            format = function(s, c) {
                return s.replace(/{(\w+)}/g, function(m, p) {
                    return c[p];
                })
            };
 
    return function(table, name) {
        var ctx = {
            worksheet : name || 'Worksheet',
            table : table.innerHTML
        }
        return uri + base64(format(template, ctx));
    }
})();
 
$(function(){
    $('#exportExcel').on('click', function(){
        var $this = $(this);
        //设定下载的文件名及后缀
        $this.attr('download', '商店列表.xls');
        //设定下载内容
        $this.attr('href', tableToExcel($('#tableExcel')[0], '财务统计'));
    });
});
</script>
</html>
